<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="../../css/weui.min.css" />
    <link rel="stylesheet" type="text/css" href="../../css/jquery-weui.min.css" />
    <link rel="stylesheet" type="text/css" href="../../css/login.css" />
    <link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_546019_0ch5uh619edk7qfr.css" />
    <link rel="stylesheet" href="../../css/index.css">
    <title>注册</title>
    <script src="../../js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../js/jquery-weui.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../js/baseConfig.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../js/city-picker.min.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
    <!--<div id="header">
			<div class="header-title" style="position: fixed;top: 0;border-bottom: 1px solid #e2e2e2;">
				<img src="../../img/left.png" class="left" />
				<span>注册</span>
			</div>
		</div>-->
    <div class="register-type" style="margin-top: 0;">
        <div class="name">
            <span>供应商名称<img src="../../img/start.png"></span>
            <input type="text" class="vebdor-name" placeholder="请填写供应商名称" />
        </div>
        <div class=" name">
            <span>所在地<img src="../../img/start.png"></span>
            <input type="text" class="address" placeholder="请选择供应商所在地" />
        </div>
        <div class=" name">
            <span>供应商地址<img src="../../img/start.png"></span>
            <input type="text" class="vebdor-address" placeholder="请填写供应商所在地" />
        </div>
        <div class="name  select-type">
            <span>供应商类型<img src="../../img/start.png"></span>
            <i class="iconfont icon-sanjiaodown vebdorIcon"></i>
            <input type="text" class="vebdor-type" disabled="disabled" placeholder="请选择供应商类型" />
            <ul class="name_ul person_type">
                <li class="active">
                    <b>企业</b>
                </li>
                <li>
                    <b>个人</b>
                </li>
            </ul>
        </div>
        <div class=" name select-type">
            <span>证件类型<img src="../../img/start.png"></span>
            <i class="iconfont icon-sanjiaodown documentIcon"></i>
            <input type="text" class="document-type" disabled="disabled" placeholder="请选择证件类型" />
            <ul class="name_ul card">
                <li class="active">
                    <b>身份证</b>
                </li>
                <li>
                    <b>三证与法人身份证</b>
                </li>
                <li>
                    <b>三证合一与法人身份证</b>
                </li>
            </ul>
        </div>
        <div class="name">
            <span>公司电话<img src="../../img/start.png"></span>
            <input type="tel" class="company-phone" placeholder="请填写公司电话" />
        </div>
        <div class="name select-type">
            <span>业务范围<img src="../../img/start.png"></span>
            <i class="iconfont icon-sanjiaodown scopeBusiness"></i>
            <input type="text" class="scope-business" value="" disabled="disabled" placeholder="请选择业务范围" />
        </div>
        <div class="name">
            <span>联系人<img src="../../img/start.png"></span>
            <input type="text" class="link-man" placeholder="清填写联系人" />
        </div>
        <div class=" name">
            <span>联系人手机<img src="../../img/start.png"></span>
            <input type="tel" class="linkman-phone" placeholder="请填写联系人手机" />
        </div>
        <div class=" name">
            <span>联系人邮箱<img src="../../img/start.png"></span>
            <input type="email" class="linkman-email" placeholder="请填写联系人邮箱" />
        </div>
        <div class=" name" style="border-bottom: 0;">
            <span>备注</span>
        </div>
        <textarea name="" class="remarks"></textarea>
    </div>
    <div class="demos-content-padded" style="margin: 1.6rem 0;padding: 0 1.1rem;">
        <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_default" style="float: left;">取消</a>
        <a href="javascript:;" class="weui-btn weui-btn_mini weui-btn_primary" style="float: right;margin-top: 0;background: #28c81e;">下一步</a>
    </div>
</body>
<script type="text/javascript">
    $(document).ready(function() {
        baseConfig.historyBack();
        //获取供应商所有区域
        $.ajax({
                type: "get",
                url: baseConfig.localHttp + "api/client/getAllArea",
                async: false,
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                },
                success: function(data) {
                    var temp = [];
                    if (data.code == 100) {
                        for (var i = 0; i < data.content.length; i++) {
                            temp.push(data.content[i].name)
                        }
                        $(".address").picker({
                            title: "请选择所在地区",
                            cols: [{
                                textAlign: 'center',
                                values: temp
                            }],
                            onClose: function(value, displayValue) {
                                //$(".").val(value.value[0])
                            }
                        })
                    } else {
                        $.toptip(data.content, 1200, 'error');
                    }
                },
                error: function() {
                    $.hideLoading();
                    $.toast("请求失败", "cancel");
                }
            })
            //正则判断\
        function checkPhone(str) {
            var re = /^400-([0-9]){1}([0-9-]{7})$/
            var re2 = /^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/
            if (re2.test(str)) {
                return str
            } else {
                if (re.test(str)) {
                    return str
                } else {

                    return false
                }
            }
        }

        function checkMobile(str) {
            var res = /^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/;
            if (res.test(str)) {
                return str;
            } else {
                return false;
            }
        }

        function checkEmail(str) {
            var res = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/
            if (res.test(str)) {
                return str
            } else {
                //						$.toptip("请输入正确的邮箱", 1200, 'error');
                return false;
            }
        }
        //验证电话号码
        //			$(".company-phone").blur(function() {
        //				checkPhone($(".company-phone").val())
        //			})
        //			//验证手机号码
        //			$(".linkman-phone").blur(function() {
        //				console.log(checkMobile($(".linkman-phone").val()))
        //			})
        //			//验证邮箱格式
        //			$(".linkman-email").blur(function() {
        //				checkEmail($(".linkman-email").val())
        //			})
        //获取业务范围列表
        $.ajax({
            type: "get",
            url: baseConfig.localHttp + "api/order/getFgCategoryList",
            async: false,
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            success: function(data) {
                var temp = [];
                if (data.code == 100) {
                    for (var i = 0; i < data.content.length; i++) {
                        var fn = {
                            title: data.content[i].materialName,
                            value: data.content[i].id,
                        }
                        temp.push(fn)
                    }
                    $(".scopeBusiness").select({
                        title: "请选择业务范围",
                        items: temp,
                        multi: true,
                        onClose: function(result) {
                            $(".scope-business").val(result.data.titles)
                        }
                    })
                } else {
                    $.toptip(data.content, 1200, 'error');
                }
            },
            error: function() {
                $.hideLoading();
                $.toast("请求失败", "cancel");
            }
        })

        //点击切换效果
        $(".vebdorIcon").click(function() {
                var flag = $(this).hasClass('active');
                if (!flag) {
                    $(this).addClass('active');
                    $(this).css("color", "#28C81E");
                    $(this).parents(".name").find(".name_ul").slideDown();
                    var that = $(this).parents(".name").find(".name_ul li")
                    $(that).click(function() {
                        var value = $(this).find('b').html()
                        $(this).parents(".name").find("input").val(value)
                        $(this).parents(".name").find(".icon-sanjiaodown").removeClass('active');
                        $(this).parents(".name").find(".icon-sanjiaodown").css("color", "#000")
                        $(this).addClass("active").siblings().removeClass("active")
                        $(this).parents(".name").find(".name_ul").slideUp()
                        $(".document-type").val("")
                        if ($(".vebdor-type").val() == "个人") {
                            $(".card").empty()
                            $(".card").html("<li class='active'><b>身份证</b></li>")
                        } else {
                            $(".card").empty()
                            $(".card").html("<li class='active'><b>三证与法人身份证</b></li><li class=''><b>三证合一与法人身份证</b></li>")
                        }
                    })
                } else {
                    $(this).removeClass('active');
                    $(this).css("color", "#000");
                    $(this).parents(".name").find(".name_ul").slideUp()
                }
            })
            ////只有在选中供应商类型后才能选择证件类型
        $(".documentIcon").click(function() {
            if ($(".vebdor-type").val()) {
                var Flag = $(this).hasClass('active');
                if (!Flag) {
                    $(this).addClass('active');
                    $(this).css("color", "#28C81E");
                    $(this).parents(".name").find(".name_ul").slideDown();
                    var that = $(this).parents(".name").find(".name_ul li")
                    $(that).click(function() {
                        var value = $(this).find('b').html()
                        $(this).parents(".name").find("input").val(value)
                        $(this).parents(".name").find(".icon-sanjiaodown").removeClass('active');
                        $(this).parents(".name").find(".icon-sanjiaodown").css("color", "#000")
                        $(this).addClass("active").siblings().removeClass("active")
                        $(this).parents(".name").find(".name_ul").slideUp()
                    })
                } else {
                    $(this).removeClass('active');
                    $(this).css("color", "#000");
                    $(this).parents(".name").find(".name_ul").slideUp()
                }
            } else {
                $.alert("请先选择供应商类型");
            }

        })

        $(".weui-btn_primary").click(function() {
            var vebdor_name = $(".vebdor-name").val() //供应商名称
            var address = $(".address").val() //供应商所在地
            var vebdor_address = $(".vebdor-address").val() //供应商详细地址
            var vebdor_type = $(".vebdor-type").val() //供应商类型
            if (!vebdor_type) {} else {
                if (vebdor_type == "企业") {
                    vebdor_type = 0
                } else {
                    vebdor_type = 1
                }
            }
            var document_type = $(".document-type").val() //供应商证件类型
            if (!document_type) {

            } else {
                if (document_type == "三证与法人身份证") {
                    document_type = 0
                } else {
                    if (document_type == "三证合一与法人身份证") {
                        document_type = 1
                    } else {
                        document_type = 2
                    }
                }
            }

            var company_phone = $(".company-phone").val() //公司电话

            var scope_business = $(".scopeBusiness").attr("value") //业务范围
            var id = $(".scopeBusiness").attr("data-values") //业务id
            var link_man = $(".link-man").val() //联系人
            var linkman_phone = $(".linkman-phone").val() //联系人手机
            var linkman_email = $(".linkman-email").val() //联系人邮箱
            var remarks = $(".remarks").val() //备注
                //				console.log(vebdor_type,document_type)
            if (!vebdor_name) {
                $.toptip('请填写供应商名称', 1000, 'error');
            } else if (!address) {
                $.toptip('请选择供应商所在地', 1000, 'error');
            } else if (!vebdor_address) {
                $.toptip('请填写供应商详细地址', 1000, 'error');
            } else if (vebdor_type === "") {
                console.log(vebdor_type)
                $.toptip('请选择供应商类型', 1000, 'error');
            } else if (document_type === "") {
                $.toptip('请选择证件类型', 1000, 'error');
            } else if (!company_phone) {
                $.toptip('公司电话不能为空', 1000, 'error');
            } else if (checkPhone(company_phone) != company_phone) {
                $.toptip("请输入正确的电话号码", 1200, 'error');
            } else if (!id) {
                $.toptip("请选择业务范围", 1200, 'error');
            } else if (!link_man) {
                $.toptip("联系人不能为空", 1200, 'error');
            } else if (linkman_phone === "") {
                $.toptip("手机号不能为空", 1200, 'error');
            } else if (checkMobile(linkman_phone) == 0) {
                $.toptip("请输入正确的手机号", 1200, 'error');
            } else if (checkMobile(linkman_phone) == false) {
                $.toptip("请输入正确的手机号", 1200, 'error');
            } else if (!linkman_email) {
                $.toptip("邮箱不能为空", 1200, 'error');
            } else if (checkEmail(linkman_email) != linkman_email) {
                $.toptip("邮箱格式不正确", 1200, 'error');
            } else {
                $.ajax({
                    type: "get",
                    url: baseConfig.localHttp + "api/client/addOrEditClient",
                    async: false,
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded'
                    },
                    data: {
                        clientName: vebdor_name,
                        clientAddress: vebdor_address,
                        clientArea: address,
                        clientType: vebdor_type,
                        clientPapersType: document_type,
                        clientPhone: company_phone,
                        clientContactName: link_man,
                        clientContactMobile: linkman_phone,
                        scopeBussinessId: id,
                        scopeBussinessName: scope_business,
                        clientContactEmail: linkman_email,
                        remarks: remarks
                    },
                    success: function(data) {
                        console.log(data)
                        if (data.code == 100) {
                            location.href = "registersecond.html?clientNo=" + data.content + "&type=" + vebdor_type + "&type2=" + document_type
                        } else {
                            $.toptip(data.content, 1200, 'error');
                        }
                    },
                    error: function() {
                        $.hideLoading();
                        $.toast("请求失败", "cancel");
                    }
                })
            }
            //				if($(".register-type").find("input").val() == "") {
            //					$.toptip('信息填写不全', 1000, 'error');
            //					//$.toast("供应商名称不能为空", "text");
            //				} else {
            //					//新增供应商
            //					
            //					//				
            //				}
        })
        $(".weui-btn_default").on("click", function() {
            history.back()
        })
    })
</script>

</html>